<template>
  <view>
    <HeaderNavTabarVue :title="title" />
    <!--        <z-paging ref="paging" v-model="dataList" @query="queryList">-->
    <view class="uv-empty" v-if="dataList.length === 0">
      <uv-empty icon="../static/images/empty.png"></uv-empty>
    </view>
    <view v-else>
      <view v-if="title === '补卡'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>补卡日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
          <p class="content-box">
            <text>补卡班次:</text>
            <text>{{ item.position }}</text>
          </p>
          <p class="content-box">
            <text>补卡时间:</text>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '请假'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>部门:</text>
            <text>{{ item.deptName }}</text>
          </p>
          <p class="content-box">
            <text>请假类型:</text>
            <text>{{ item.type2 }}</text>
          </p>
          <p class="content-box">
            <text>开始时间:</text>
            <text>{{ item.startTime }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '加班'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>加班事由:</text>
            <text>{{ item.reason }}</text>
          </p>
          <p class="content-box">
            <text>开始时间:</text>
            <text>{{ dayjs(item.startTime).format('YYYY/MM/DD hh:mm') }}</text>
          </p>
          <p class="content-box">
            <text>结束世间:</text>
            <text>{{ dayjs(item.endTime).format('YYYY/MM/DD hh:mm') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '外出'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>外出事由:</text>
            <text>{{ item.reason }}</text>
          </p>
          <p class="content-box">
            <text>开始世间:</text>
            <text>{{ dayjs(item.startTime).format('YYYY/MM/DD hh:mm') }}</text>
          </p>
          <p class="content-box">
            <text>结束世间:</text>
            <text>{{ dayjs(item.endTime).format('YYYY/MM/DD hh:mm') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '出差'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>出差事由:</text>
            <text>{{ item.reason }}</text>
          </p>
          <p class="content-box">
            <text>出差地点:</text>
            <text>{{ item.position }}</text>
          </p>
          <p class="content-box">
            <text>开始时间:</text>
            <text>{{ dayjs(item.startTime).format('YYYY/MM/DD hh:mm') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '经营性付款申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>关联工单:</text>
            <text>{{ item.orderId }}</text>
          </p>
          <p class="content-box">
            <text>费用承担部门:</text>
            <text>{{ item.deptName }}</text>
          </p>
          <p class="content-box">
            <text>付款事由:</text>
            <text>{{ item.reason }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '非经营性付款申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>费用承担部门:</text>
            <text>{{ item.deptName }}</text>
          </p>
          <p class="content-box">
            <text>付款事由:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD hh:mm') }}</text>
          </p>
          <p class="content-box">
            <text>费用类别:</text>
            <text>{{ item.reason }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '备用金申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>申请人:</text>
            <text>{{ item.nickName }}</text>
          </p>
          <p class="content-box">
            <text>部门:</text>
            <text>{{ item.deptName }}</text>
          </p>
          <p class="content-box">
            <text>申请金额:</text>
            <text>{{ item.money }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '文旅运营专项付款申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>费用承担部门:</text>
            <text>{{ item.deptName }}</text>
          </p>
          <p class="content-box">
            <text>付款事由:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD hh:mm') }}</text>
          </p>
          <p class="content-box">
            <text>费用类别:</text>
            <text>{{ item.costCategory }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '业务招待报备申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>关联工单:</text>
            <text>{{ item.orderId }}</text>
          </p>
          <p class="content-box">
            <text>招待日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD hh:mm') }}</text>
          </p>
          <p class="content-box">
            <text>招待事由:</text>
            <text>{{ item.reason }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '采购申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>申请事由:</text>
            <text>{{ item.reason }}</text>
          </p>
          <p class="content-box">
            <text>采购类型:</text>
            <text>{{ item.purchaseNature }}</text>
          </p>
          <p class="content-box">
            <text>期望交付日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '货品抵账申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>抵账客户共担:</text>
            <text>{{ item.orderId }}</text>
          </p>
          <p class="content-box">
            <text>是否在合同约定抵货额度范围内:</text>
            <text>{{ item.isWithin }}</text>
          </p>
          <p class="content-box">
            <text>抵货日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '项目资金众筹申请列表'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>众筹人员:</text>
            <text v-for="item in JSON.parse(item.personnel)" class="infoText">
              {{ item.nickName }}
            </text>
          </p>
          <p class="content-box">
            <text>众筹金额:</text>
            <text>{{ item.money }}</text>
          </p>
          <p class="content-box">
            <text>预计资金到账日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '油费报销申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY-MM-DD HH:mm:ss') }}</text>
          </view>
          <p class="content-box">
            <text>报销人:</text>
            <text v-for="item in JSON.parse(item.personnel)" class="infoText">
              {{ item.nickName }}
            </text>
          </p>
          <p class="content-box">
            <text>拜访客户:</text>
            <text>
              {{ item.position }}
            </text>
          </p>
          <view class="content-box">
            <text>拜访记录ID:</text>
            <text>{{ item.applyId }}</text>
          </view>
          <p class="content-box">
            <text>报销日期:</text>
            <text>{{ dayjs(item.date).format('YYYY-MM-DD HH:mm:ss') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '入职申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>分公司副总及以上:</text>
            <text>{{ item.trialPost }}</text>
          </p>
          <p class="content-box">
            <text>入职人姓名:</text>
            <text v-for="(item, index) in JSON.parse(item.details)" :key="index"
              >{{ item.entryName }}
            </text>
          </p>
          <p class="content-box">
            <text>部门:</text>
            <text v-for="(item, index) in JSON.parse(item.details)" :key="index"
              >{{ item.deptName }}
            </text>
          </p>
        </view>
      </view>
      <view v-if="title === '转正审批'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>转正员工姓名:</text>
            <text class="infoText">
              {{ item.nickName }}
            </text>
          </p>
          <p class="content-box">
            <text>部门:</text>
            <text>{{ item.deptName }} </text>
          </p>
          <p class="content-box">
            <text>入职日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '离职'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>所属经营中心:</text>
            <text>{{ item.deptName }} </text>
          </p>
          <p class="content-box">
            <text>离职申请人:</text>
            <text class="infoText">
              {{ item.nickName }}
            </text>
          </p>
          <p class="content-box">
            <text>入职日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '物品领用申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
          <p class="content-box">
            <text>领用用途分类:</text>
            <text>{{ item.classification }}</text>
          </p>
          <p class="content-box">
            <text>领用用途:</text>
            <text>{{ item.received }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '用章用印申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>用印日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
          <p class="content-box">
            <text>使用人:</text>
            <text>{{ item.nickName }}</text>
          </p>
          <p class="content-box">
            <text>用印部门:</text>
            <text>{{ item.deptName }}</text>
          </p>
        </view>
      </view>

      <view v-if="title === '物品维修'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>故障设备名称:</text>
            <text>{{ item.deviceName }}</text>
          </p>
          <p class="content-box">
            <text>故障描述:</text>
            <text>{{ item.reason }}</text>
          </p>
          <p class="content-box">
            <text>日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>
      <view v-if="title === '用车'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>用车事由:</text>
            <text>{{ item.reason }}</text>
          </p>
          <p class="content-box">
            <text>开始时间:</text>
            <text>{{ dayjs(item.startTime).format('YYYY/MM/DD') }}</text>
          </p>
          <p class="content-box">
            <text>结束时间:</text>
            <text>{{ dayjs(item.endTime).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>

      <view v-if="title === '合同流转'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>合同名称:</text>
            <text>{{ item.name }}</text>
          </p>
          <p class="content-box">
            <text>对方单位名称:</text>
            <text>{{ item.otherCompanyName }}</text>
          </p>
          <p class="content-box">
            <text>签约日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>

      <view v-if="title === '固定资产报废申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>报废设备名称:</text>
            <text>{{ item.name }}</text>
          </p>
          <p class="content-box">
            <text>报废原因:</text>
            <text>{{ item.reason }}</text>
          </p>
        </view>
      </view>

      <view v-if="title === '会议室预定'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>会议室名称:</text>
            <text>{{ item.name }}</text>
          </p>
          <p class="content-box">
            <text>开始时间:</text>
            <text>{{ dayjs(item.startTime).format('YYYY/MM/DD') }}</text>
          </p>
          <p class="content-box">
            <text>结束时间:</text>
            <text>{{ dayjs(item.endTime).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>

      <view v-if="title === '公文流转'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>文件名称:</text>
            <text>{{ item.name }}</text>
          </p>
          <p class="content-box">
            <text>紧急程度:</text>
            <text>{{ item.emergencyDegree }}</text>
          </p>
          <p class="content-box">
            <text>来文单位:</text>
            <text>{{ item.otherCompanyName }}</text>
          </p>
        </view>
      </view>

      <view v-if="title === '临时工人使用申请'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>项目名称:</text>
            <text>{{ item.projectName }}</text>
          </p>
          <p class="content-box">
            <text>申请人:</text>
            <text v-for="item in JSON.parse(props.data.personnel)" class="infoText">
              {{ item.nickName }}
            </text>
          </p>
          <p class="content-box">
            <text>申请日期:</text>
            <text>{{ dayjs(item.date).format('YYYY/MM/DD') }}</text>
          </p>
        </view>
      </view>

      <view v-if="title === '培训会议请假单'" class="model-type-box">
        <view
          v-for="(item, index) in dataList"
          :key="item.applyId"
          class="model-type-list"
          @click="itemClick(item, index)"
        >
          <view class="header-box">
            <view class="title">
              <h4>{{ item.type }}</h4>
              <p :class="item.applyStatus">{{ item.applyStatus }}</p>
            </view>
            <text>{{ dayjs(item.createTime).format('YYYY/MM/DD') }}</text>
          </view>
          <p class="content-box">
            <text>所属部门:</text>
            <text>{{ item.deptName }}</text>
          </p>
          <p class="content-box">
            <text>申请类型:</text>
            <text>{{ item.leaceType }}</text>
          </p>
          <p class="content-box">
            <text>具体情况描述:</text>
            <text>{{ item.remark }}</text>
          </p>
        </view>
      </view>
    </view>
    <!--        </z-paging>-->

    <view v-show="statusLoding" class="animbox-scroll-loading">
      <view></view>
      <view></view>
      <view></view>
      <view></view>
      <view></view>
    </view>
  </view>
</template>

<script setup>
import HeaderNavTabarVue from '@/components/HeaderNavTabar/HeaderNavTabar.vue'
import { onMounted, ref } from 'vue'
import { onLoad, onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app'
import {
  attendanceApplyListApi,
  listAdministrativeApply,
  listFinancialApplyControllerApi,
  listPersonnelApply,
} from '@/api/attendance'
import dayjs from 'dayjs'
import { getUserProfile } from '@/api/system/user'

const title = ref(null)
const dataList = ref([])
const paging = ref(null)

const getWeek = (date) => {
  let datas = dayjs(date).day()
  let week = ['日', '一', '二', '三', '四', '五', '六']
  return '星期' + week[datas]
}

const queryList = (pageNo, pageSize) => {
  const params = {
    pageNum: pageNo,
    pageSize: pageSize,
    type: title.value,
  }
  getattendanceApplyListApiFn(params)
    .then((res) => {
      console.log(res.data.list)
      paging.value.complete(res.data.list)
    })
    .catch((res) => {
      paging.value.complete(false)
    })
}
const profile = ref(null)
onMounted(async () => {
  profile.value = (await getUserProfile()).data
})

const itemClick = (item, index) => {
  console.log(item)
  switch (item.appType) {
    case '考勤':
      uni.navigateTo({
        url: `/pages/audit/auditDetails?type=${item.appType}&id=${
          item.applyId
        }&shengpiFlag=${false}`,
      })
      break
    case '财务':
      uni.navigateTo({
        url: `/pages/audit/auditDetails?type=${item.appType}&id=${
          item.financialId
        }&shengpiFlag=${false}`,
      })
      break
    case '人事':
      uni.navigateTo({
        url: `/pages/audit/auditDetails?type=${item.appType}&id=${
          item.personnelId
        }&shengpiFlag=${false}`,
      })
      break
    case '行政':
      uni.navigateTo({
        url: `/pages/audit/auditDetails?type=${item.appType}&id=${
          item.administrativeId
        }&shengpiFlag=${false}`,
      })
      break
    case '其他':
      break
  }
}
const apiName = ref(null)

let pageNum = ref(1)
let pageSize = ref(10)
let totals = ref(888)
let statusLoding = ref(false)

const getattendanceApplyListApiFn = async () => {
  let params = {
    type: title.value,
    pageNum: pageNum.value,
    pageSize: pageSize.value,
  }
  let { code, rows, total } = await attendanceApplyListApi(params)
  try {
    if (code === 200) {
      if (statusLoding.value) {
        statusLoding.value = false //加载中状态
      }
      dataList.value = [...dataList.value, ...rows]
      totals.value = total
    }
  } catch {}
}
const listFinancialApplyControllerApiFn = async () => {
  let params = {
    type: title.value,
    pageNum: pageNum.value,
    pageSize: pageSize.value,
  }
  let { code, rows, total } = await listFinancialApplyControllerApi(params)
  try {
    if (code == 200) {
      if (statusLoding.value) {
        statusLoding.value = false //加载中状态
      }
      dataList.value = [...dataList.value, ...rows]

      totals.value = total
    }
  } catch {}
}
const listAdministrativeApplyFn = async () => {
  let params = {
    type: title.value,
    pageNum: pageNum.value,
    pageSize: pageSize.value,
  }
  let { code, rows, total } = await listAdministrativeApply(params)
  try {
    if (code == 200) {
      if (statusLoding.value) {
        statusLoding.value = false //加载中状态
      }
      dataList.value = [...dataList.value, ...rows]

      totals.value = total
    }
  } catch {}
}
const listPersonnelApplyFn = async () => {
  let params = {
    type: title.value,
    pageNum: pageNum.value,
    pageSize: pageSize.value,
  }
  let { code, rows, total } = await listPersonnelApply(params)
  try {
    if (code == 200) {
      if (statusLoding.value) {
        statusLoding.value = false //加载中状态
      }
      dataList.value = [...dataList.value, ...rows]
      totals.value = total
    }
  } catch {}
}
// 上拉架子啊
onReachBottom(() => {
  statusLoding.value = true //加载完状态
  let allTotal = pageNum.value * pageSize.value
  if (allTotal < totals.value) {
    pageNum.value++
    if (apiName.value === '财务') {
      listFinancialApplyControllerApiFn()
    } else if (apiName.value === '行政') {
      listAdministrativeApplyFn()
    } else if (apiName.value === '人事') {
      listPersonnelApplyFn()
    } else {
      getattendanceApplyListApiFn()
    }
  } else {
    uni.showToast({
      title: '数据加载完毕',
    })
    statusLoding.value = false
  }
})
onPullDownRefresh(async () => {
  pageNum.value = 1
  if (apiName.value === '财务') {
    await listFinancialApplyControllerApiFn()
    // 关闭下拉刷新
    uni.stopPullDownRefresh()
  } else if (apiName.value === '行政') {
    await listAdministrativeApplyFn()
    // 关闭下拉刷新
    uni.stopPullDownRefresh()
  } else if (apiName.value === '人事') {
    await listPersonnelApplyFn()
    // 关闭下拉刷新
    uni.stopPullDownRefresh()
  } else {
    await getattendanceApplyListApiFn()
    // 关闭下拉刷新
    uni.stopPullDownRefresh()
  }
})
onLoad((v) => {
  title.value = v.type
  apiName.value = v.apiName
  let params = {
    type: title.value,
    pageNum: 1,
    pageSize: 2000,
  }
  if (apiName.value === '财务') {
    listFinancialApplyControllerApiFn(params)
  } else if (apiName.value === '行政') {
    listAdministrativeApplyFn(params)
  } else if (apiName.value === '人事') {
    listPersonnelApplyFn(params)
  } else {
    getattendanceApplyListApiFn(params)
  }
})
</script>

<style lang="scss" scoped>
@import '@/static/style/index.scss';

.model-type-box {
  //margin-top: 70rpx;
  .model-type-list {
    padding: 20rpx;

    background-color: #fff;
    border-bottom: 1px solid #e5e6eb;
  }

  .header-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20rpx;

    .title {
      @include flex($justify: center, $align: center);

      h4 {
        font-size: 35rpx;
        margin-right: 5rpx;
      }

      p {
        @include flex($justify: center, $align: center);
        padding: 0 8rpx;
        border-radius: 5rpx;
        font-size: 20rpx;
      }

      .审核通过,
      .已通过 {
        color: #00b42a;
        background-color: #e8ffea;
      }

      .待审核,
      .审核中 {
        color: #ff7d00;
        background-color: #fff7e8;
      }

      .驳回 {
        color: $btn-error-color;
        background-color: $btn-error-bg;
      }

      .已撤销 {
        color: #86909c;
        background-color: #f2f3f5;
      }
    }

    text {
      color: #86909c;
      font-size: 24rpx;
    }
  }

  .content-box {
    margin-top: 10rpx;

    text {
      font-size: 26rpx;
      margin-right: 5rpx;
    }
  }
}
</style>
